import './index.scss'
import {useNavigate} from "react-router-dom";
import React from "react";

interface Props {
    data?: Array<any>
}

const LiteratureList = React.memo(({data = []}: Props) => {
    const n = useNavigate();
    return (
        <div className="literature-list-box">
            {
                data.map((v => {
                    return (
                        <div onClick={() => n(`/literature/${v.id}`)} key={v.id}>
                            <div>
                                <img src={v.cover_url} alt=""/>
                            </div>
                            <div>
                                <h2>{v.name}</h2>
                                <p>{v.introduce}</p>
                            </div>
                        </div>
                    )
                }))
            }

        </div>
    )
})
export default LiteratureList;